<template>
    <div>
        <van-nav-bar title="商品详情" left-text="返回" left-arrow @click-left="onClickLeft" />
        <!--轮播图-->
        <!-- <van-swipe :autoplay="2000">
            <van-swipe-item v-for="(image, index) in images" :key="index">
                <img v-lazy="image" width="100%" height="250" />
            </van-swipe-item>
        </van-swipe> -->
        <img :src="this.goodInfo.goodCover" style="width: 100%; height: 250px ; border-radius: 10%;"/>
        <div id="center" style="height:200px ;">
            <p>{{this.goodInfo.goodName}}</p>
            <div>
                <p>价格:{{this.goodInfo.goodPrice}}积分</p>
                <P>剩余{{this.goodInfo.goodStock}}件</P>
                <P>上架日期:{{this.goodInfo.goodDate}}</P>
            </div>
            <p>商品详情图片</p>
            <div v-for="image in images">
                <img :src="image"/>
            </div>
        </div>


        <van-goods-action>
            <van-goods-action-button type="danger" text="立即购买" @click="toOrder(goodInfo.goodId)" />
        </van-goods-action>
    </div>
</template>

<script>
    import axios from 'axios'
export default {
    data() {
        return {
            //轮播图
            images: [],
            goodInfo: {},
            goodId:''
        }
    },methods: {
        findShopsById() {
            axios.post('http://localhost:7000/shop/findGoodByGoodId', { 'goodId': this.goodId }).then(res => {
                this.goodInfo = res.data.data;
                this.images = res.data.data.goodImage;
                console.log(this.goodInfo);

            });
        },
        onClickLeft() {
            this.$router.go(-1)
        },
        toOrder(goodId) { 
            axios.post('http://localhost:7000/shop/addOrder', { 'goodId': this.goodId }).then(res => {
                if (res.data.code == 1) {
                    this.$router.push({ name: "orderInfo", params: { id: goodId, orderId: res.data.data } });
                 }

            });
            
        }
    },
    //生命周期 - 创建完成（访问当前this实例）
    created() {
        
    },
    //生命周期 - 挂载完成（访问DOM元素）
    mounted() {
        this.goodId = this.$route.params.id;
        this.findShopsById();
    }
}
</script>
<style scoped>
/* @import url(); 引入css类 */

</style>